<script setup lang="ts">
import { storeToRefs } from 'pinia';
import useCounterStore from './stores/counter'
// !必须调用一下生成 store 实例
const counterStore = useCounterStore()
// 方法正常解构就行
const { increment, incrementAsync } = counterStore
// 用 storeToRefs 把数据转为 ref，解构出来可以保持响应式
const { count, doubleCount} = storeToRefs(counterStore)
</script>
<template>
  <div>
    <p>count: {{ count }}</p>
    <p>doubleCount: {{ doubleCount }}</p>
    <button @click="increment">+1</button>
    <button @click="incrementAsync">async+1</button>
  </div>
</template>
